<%--
  Created by IntelliJ IDEA.
  User: eventhorizonsky
  Date: 2021/9/3
  Time: 13:52
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>

  <title>首页</title>
  <meta name="viewport" content="width=device-width">

  <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  <%--    MDUI的css包--%>
  <link
          rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css"
          integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw"
          crossorigin="anonymous"
  />
  <style>
    body{
      overflow: scroll;
      max-height: 100%;
    }
    /*设置搜索框的样式*/
    .textout{
      width: 50%;
      height: 70%;
      border-radius: 10px;
      background-color: #f0ffff91;
    }
    .textinside{
      height:70%;
      padding-top: 5px;
      width: 80%;
    }
    .searchtext{
      background: none;
      outline:none;
      border:none;
      padding: 10px;
      width: 100%;
    }
  </style>
</head>
<%--设置主色调为蓝色，设置应用栏不被覆盖--%>
<body class="mdui-theme-primary-indigo mdui-appbar-with-toolbar mdui-theme-accent-pink mdui-loaded" id="bd">
<%--应用栏--%>
<div class="mdui-appbar mdui-appbar-fixed">
  <div class="mdui-toolbar mdui-color-theme">
    <a href="javascript:;"  mdui-drawer="{target: '#left-drawer'}" class="mdui-btn mdui-btn-icon"><i class="mdui-icon material-icons">menu</i></a>
    <a href="index.jsp" class="mdui-typo-headline">MDUI</a>
    <div class="mdui-toolbar-spacer"></div>
    <%--搜索框--%>
    <div class="textout">
      <form action="SearchResult.jsp">
        <div class="mdui-textfield mdui-textfield-floating-label mdui-center textinside">
          <input class="searchtext" type="text" name="searchword" placeholder="搜索关键词">
        </div>
      </form>
    </div>
    <div class="mdui-toolbar-spacer"></div>
    <%-- 主题切换按钮--%>
    <a href="javascript:;" class="mdui-btn mdui-btn-icon change-theme-dark" id="changetheme"><i class="mdui-icon material-icons">&#xe3a9;</i></a>
    <%--如果已登录则显示头像，未登录则点击可以弹出登录窗口--%>
    <%if(request.getSession().getAttribute("user") != null) {%>
    <a href="javascript:;" class="mdui-btn mdui-btn-icon" mdui-menu="{target: '#usermenu',covered:false,posision:'bottom'}"><img style="width: 30px;height: 30px;padding: 9px" src="https://www.ezsky.xyz/wp-content/uploads/2020/07/blackhole.png"></a>
    <ul class="mdui-menu"  id="usermenu">
      <li class="mdui-menu-item">
        <a href="javascript:;" class="mdui-ripple">
          <i class=" mdui-menu-item-icon mdui-icon material-icons">&#xe7fd;</i>个人主页
        </a>
      </li>
      <li class="mdui-menu-item">
        <a href="logoff" class="mdui-ripple">
          <i class="mdui-menu-item-icon mdui-icon material-icons">&#xe890;</i>登出
        </a>
      </li>
    </ul>
    <%}else {%>
    <a href="javascript:;" class="mdui-btn mdui-btn-icon" mdui-dialog="{target: '#login'}"><i class="mdui-icon material-icons">&#xe853;</i></a>
    <%}%>

  </div>
  <div id="schedule"></div>
</div>
<%--登录框--%>
<div class="mdui-dialog" id="login">

  <button class="mdui-btn mdui-btn-icon" style="position: absolute;"  mdui-dialog-close><i class="mdui-icon material-icons">close</i></button>
  <div class="mdui-dialog-title" style="background-color: #3f51b5;margin-bottom: 24px;padding: 146px 40px 28px;color: #fff;">登录</div>

  <form id="loginform" method="post">
    <div class="mdui-textfield mdui-textfield-floating-label mdui-center" style="width: 80%">
      <label class="mdui-textfield-label">邮箱</label>
      <input class="mdui-textfield-input" type="email" name="email" id="email" required/>
      <div class="mdui-textfield-error">邮箱不能为空</div>
    </div>
    <div class="mdui-textfield mdui-textfield-floating-label mdui-center"  style="width: 80%" >
      <label class="mdui-textfield-label">密码</label>
      <input class="mdui-textfield-input" type="password" name="password" id="password" required/>
      <div class="mdui-textfield-error">密码不能为空</div>
    </div>

    <div style="margin: 5% 0;width: 80%"class="mdui-center">
      <button class="mdui-btn mdui-ripple more-option" type="button" mdui-menu="{target: '#mc-login-menu', position: 'top', covered: true}">更多<i class="mdui-icon material-icons mdui-text-color-theme-icon">arrow_drop_down</i></button>
      <ul class="mdui-menu" id="mc-login-menu" style="transform-origin: 0px 100%; position: fixed;">
        <li class="mdui-menu-item"><a class="mdui-ripple"  mdui-dialog-close mdui-dialog="{target: '#forget'}">忘记密码</a></li>
        <li class="mdui-menu-item"><a class="mdui-ripple" mdui-dialog-close mdui-dialog="{target: '#registered'}" >创建新账号</a></li>
      </ul>
      <button type="button" onclick="login()" class="mdui-btn mdui-btn-raised mdui-btn-dense mdui-color-theme-accent mdui-ripple" style="float: right" >登录</button>
    </div>

  </form>
</div>
<%--注册框--%>
<div class="mdui-dialog" id="registered">
  <button class="mdui-btn mdui-btn-icon" style="position: absolute;"  mdui-dialog-close><i class="mdui-icon material-icons">close</i></button>
  <div class="mdui-dialog-title" style="background-color: #4caf50;margin-bottom: 24px;padding: 146px 40px 28px;color: #fff;">注册</div>
  <form method="post">

    <div class="mdui-textfield mdui-textfield-floating-label mdui-center" style="width: 80%">
      <label class="mdui-textfield-label">邮箱</label>
      <input class="mdui-textfield-input" type="email" name="uemail" id="uemail"/>
    </div>
    <div class="mdui-row mdui-center"   style="width: 83%">
      <div class="mdui-textfield mdui-textfield-floating-label mdui-col-xs-8 mdui-center">
        <label class="mdui-textfield-label">验证码</label>
        <input class="mdui-textfield-input" type="password" name="vcode" id="vcode"/>
      </div>
      <div class="mdui-col-xs-4 mdui-valign" style="top: 32px">
        <button onclick="" class="mdui-btn mdui-ripple mdui-center" type="button">获取验证码</button>
      </div>
    </div>
    <div style="margin: 5% 0;width: 80%"class="mdui-center">
      <button class="mdui-btn mdui-ripple more-option" type="button" mdui-menu="{target: '#mc-registered-menu', position: 'top', covered: true}">更多<i class="mdui-icon material-icons mdui-text-color-theme-icon">arrow_drop_down</i></button>
      <ul class="mdui-menu" id="mc-registered-menu" style="transform-origin: 0px 100%; position: fixed;">
        <li class="mdui-menu-item"><a class="mdui-ripple"mdui-dialog-close mdui-dialog="{target: '#login'}">登录</a></li>
        <li class="mdui-menu-item"><a class="mdui-ripple"mdui-dialog-close mdui-dialog="{target: '#forget'}">忘记密码</a></li>

      </ul>
      <button onclick="register()" type="button" class="mdui-btn mdui-btn-raised mdui-btn-dense mdui-color-theme-accent mdui-ripple" style="float: right">注册</button>
    </div>

  </form>
</div>
<%--忘记密码--%>
<div class="mdui-dialog" id="forget">
  <button class="mdui-btn mdui-btn-icon" style="position: absolute;"  mdui-dialog-close><i class="mdui-icon material-icons">close</i></button>
  <div class="mdui-dialog-title" style="background-color: #ff5722;margin-bottom: 24px;padding: 146px 40px 28px;color: #fff;">忘记密码</div>
  <form>
    <div class="mdui-textfield mdui-textfield-floating-label mdui-center" style="width: 80%">
      <label class="mdui-textfield-label">邮箱</label>
      <input class="mdui-textfield-input" type="email"/>
    </div>
    <div class="mdui-textfield mdui-textfield-floating-label mdui-center"  style="width: 80%">
      <label class="mdui-textfield-label">验证码</label>
      <input class="mdui-textfield-input" type="password"/>

    </div>
    <div style="margin: 5% 0;width: 80%"class="mdui-center">
      <button class="mdui-btn mdui-ripple more-option" type="button" mdui-menu="{target: '#mc-forget-menu', position: 'top', covered: true}">更多<i class="mdui-icon material-icons mdui-text-color-theme-icon">arrow_drop_down</i></button>
      <ul class="mdui-menu" id="mc-forget-menu" style="transform-origin: 0px 100%; position: fixed;">
        <li class="mdui-menu-item"><a class="mdui-ripple"mdui-dialog-close mdui-dialog="{target: '#login'}">登录</a></li>
        <li class="mdui-menu-item"><a class="mdui-ripple"mdui-dialog-close mdui-dialog="{target: '#registered'}">创建新账号</a></li>

      </ul>
      <button class="mdui-btn mdui-btn-raised mdui-btn-dense mdui-color-theme-accent mdui-ripple" style="float: right">下一步</button>
    </div>

  </form>
</div>
<%--抽屉栏--%>
<div class="mdui-drawer mdui-drawer-close mdui-shadow-1" id="left-drawer">
  <ul class="mdui-list">
    <a href="index.jsp">
      <li class="mdui-list-item mdui-ripple">
        <i class="mdui-icon material-icons mdui-list-item-icon">&#xe88a;</i>
        <div class="mdui-list-item-content">首页</div>
      </li>
    </a>
    <a href="https://www.ezsky.xyz/991.html">
      <li class="mdui-list-item mdui-ripple">
        <i class="mdui-icon material-icons mdui-list-item-icon">&#xe02f;</i>
        <div class="mdui-list-item-content">使用教程</div>
      </li>
    </a>
  </ul>
</div>

<%--在这中间写内容--%>
<div class="mdui-container" style="margin-top: 20px">
  <div class="mdui-row">
    <div class="mdui-col-xs-12" style="border-radius: 15px;
    box-shadow:5px 5px 5px 5px #888;height: 30%;">
      <div class="mdui-tab" mdui-tab>
        <a href="#example8-tab1" class="mdui-ripple">站长推荐</a>
        <a href="#example8-tab2" class="mdui-ripple">历史记录</a>
        <a href="#example8-tab3" class="mdui-ripple">热门番剧</a>
      </div>

    </div>
  <div class="mdui-col-xs-12 mdui-center" style="border-radius: 15px;
    box-shadow:5px 5px 5px 5px #888 ;height: 60%;margin-top: 20px">
    <div class="mdui-tab mdui-tab-full-width" mdui-tab>
      <a href="#Sunday" id="0" class="mdui-ripple">周日</a>
      <a href="#Monday" id="1" class="mdui-ripple">周一</a>
      <a href="#Tuesday" id="2" class="mdui-ripple">周二</a>
      <a href="#Wednesday" id="3" class="mdui-ripple">周三</a>
      <a href="#Thursday" id="4" class="mdui-ripple">周四</a>
      <a href="#Friday" id="5" class="mdui-ripple">周五</a>
      <a href="#Saturday" id="6" class="mdui-ripple">周六</a>
    </div>

    <div id="Sunday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list" style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%" ></div>
    <div id="Monday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list"  style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%" ></div>
    <div id="Tuesday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list"  style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%" ></div>
    <div id="Wednesday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list"  style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%"  ></div>
    <div id="Thursday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list"  style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%" ></div>
    <div id="Friday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list"  style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%" ></div>
    <div id="Saturday" class="mdui-p-a-2    mdui-row-xs-2 mdui-row-sm-2 mdui-row-md-2 mdui-row-lg-6  mdui-grid-list"  style="-webkit-overflow-scrolling: touch; overflow: scroll;max-height: 70%" ></div>

  </div>

  </div>

</div>

<script>


  $(function(){

    $.ajax({
      type: "GET",//请求方式
      url: "https://api.acplay.net/api/v2/bangumi/shin?filterAdultContent=false",//地址，就是json文件的请求路径
      dataType: "json",//数据类型可以为 text xml json  script  jsonp
      success: function(result){//返回的参数就是 action里面所有的有get和set方法的参数
        $.each(result.bangumiList,function(index,obj){
switch (obj.airDay) {
  case 0:
    $("#Sunday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
    break;
  case 1:
    $("#Monday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
    break;
  case 2:
    $("#Tuesday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
    break;
  case 3:
    $("#Wednesday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
    break;
  case 4:
    $("#Thursday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
    break;
  case 5:
    $("#Friday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
    break;
  case 6:
    $("#Saturday").append(
            "\n" +
            "\n" +
            "        <a href=\"Bamgumi.jsp?id="+obj.animeId+"\">\n" +
            "          <div class=\"mdui-col\">\n" +
            "            <div class=\"mdui-grid-tile\">\n" +
            "              <img src=\""+obj.imageUrl.slice(0,obj.imageUrl.length-7)+"\" style='height: 260px'/>\n" +
            "              <div class=\"mdui-grid-tile-actions\">\n" +
            "                <div class=\"mdui-grid-tile-text\">\n" +
            "                  <div class=\"mdui-grid-tile-title\">"+obj.animeTitle+"</div>\n" +
            "                </div>\n" +
            "              </div>\n" +
            "            </div>\n" +
            "          </div>\n" +
            "        </a>"
    )
}

        })
      }
    });
  });
</script>
<%--在这中间写内容--%>
<%--  MDUI的js包--%>
<script
        src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js"
        integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A"
        crossorigin="anonymous"
></script>

<script type="text/javascript">
  // 登录
  var $ = mdui.$;
  function login(){
    $("#schedule").html("<div class=\"mdui-progress\">\n" +
            "  <div class=\"mdui-progress-indeterminate\"></div>\n" +
            "</div>");
    var email = $("#email").val();
    var password = $("#password").val();
    if(isEmpty(email)) {
      mdui.snackbar({
        message: '邮箱不可为空',
        position: 'top'
      })
      return;
    }
    //  判断密码是否为空
    if(isEmpty(password)) {
      //  如果密码为空,提示用户(span标签赋值),并且return html()
      mdui.snackbar({
        message: '密码不可为空',
        position: 'top'
      })
      return;
    }
    $.ajax({
      type: "post",//请求方式
      url: "login",//地址，就是json文件的请求路径
      dataType: "json",//数据类型可以为 text xml json  script  jsonp
      data:{email:email,password:password},
      success: function(data){//返回的参数就是 action里面所有的有get和set方法的参数
        if(data.code=='1'){
          $("#schedule").html("")
          location.href="index.jsp"
        }else{
          $("#schedule").html("")
          mdui.snackbar({
            message: data.msg,
            position: 'top'
          })
        }
      }})}
  function isEmpty(str){
    if(str == null || str.trim() == ""){  //str.trim()取出前后空格
      return true;
    }
    return false;
  }
  // 注册
  var inst = new mdui.Dialog('#registeredstep2');
  function register(){
    $("#schedule").html("<div class=\"mdui-progress\">\n" +
            "  <div class=\"mdui-progress-indeterminate\"></div>\n" +
            "</div>");
    var uemail = $("#uemail").val();
    var vcode = $("#vcode").val();
    if(isEmpty(vcode)) {
      mdui.snackbar({
        message: '验证码不可为空',
        position: 'top'
      })
      return;
    }
    if(isEmpty(uemail)) {
      mdui.snackbar({
        message: '邮箱不可为空',
        position: 'top'
      })
      return;
    }
    $.ajax({
      type: "post",//请求方式
      url: "register",//地址，就是json文件的请求路径
      dataType: "json",//数据类型可以为 text xml json  script  jsonp
      data:{uemail:uemail,vcode:vcode},
      success: function(data){//返回的参数就是 action里面所有的有get和set方法的参数
        if(data.code=='1'){
          $("#schedule").html("")
          location.href="index.jsp"
          inst.open();
        }else{
          $("#schedule").html("")
          mdui.snackbar({
            message: data.msg,
            position: 'top'
          })
        }
      }})
  }
  // 切换主题
  var changetheme=document.getElementById("changetheme");
  var divEle= document.getElementById("bd");
  // 加载主题
  loadtheme();
  //从cookies读取主题
  function loadtheme(){
    if(document.cookie.indexOf("theme=")!=-1){
      var themevalue=document.cookie.split("theme=")[1].split("=")[0];
      var i=document.cookie.split("theme=")[1].split("=")[1];
      var i2=document.cookie.split("theme=")[1].split("=")[2].split(";")[0];
      // alert(themevalue+">"+i+"<"+i2);
      if(themevalue==null||i==null||i2==null){
        divEle.className='mdui-theme-primary-indigo mdui-appbar-with-toolbar mdui-theme-accent-pink mdui-loaded';//改变样式
        changetheme.innerHTML="<i class='mdui-icon material-icons'>&#xe3a9;</i>"
        changetheme.className="mdui-btn mdui-btn-icon change-theme-dark"
      }else{
        divEle.className=themevalue;
        changetheme.innerHTML="<i class='mdui-icon material-icons'>"+i+"</i>";
        changetheme.className=i2;
      }}
  }
  // 点击切换按钮切换主题
  changetheme.addEventListener('click', function() {
    var theme=changetheme.className;
    divEle= document.getElementById("bd");
    if(theme=="mdui-btn mdui-btn-icon change-theme-dark"){

      divEle.className='mdui-theme-layout-dark mdui-appbar-with-toolbar mdui-loaded';//改变样式
      this.className="mdui-btn mdui-btn-icon change-theme-light";
      this.innerHTML="<i class='mdui-icon material-icons'>&#xe1ac;</i>"
      document.cookie="theme=mdui-theme-layout-dark mdui-appbar-with-toolbar mdui-loaded=&#xe1ac=mdui-btn mdui-btn-icon change-theme-light";
    }if(theme=="mdui-btn mdui-btn-icon change-theme-light"){
      divEle= document.getElementById("bd");
      divEle.className='mdui-theme-primary-indigo mdui-appbar-with-toolbar mdui-theme-accent-pink mdui-loaded';//改变样式
      this.className="mdui-btn mdui-btn-icon change-theme-dark";
      this.innerHTML="<i class='mdui-icon material-icons'>&#xe3a9;</i>"
      document.cookie="theme=mdui-theme-primary-indigo mdui-appbar-with-toolbar mdui-theme-accent-pink mdui-loaded=&#xe3a9=mdui-btn mdui-btn-icon change-theme-dark";
    }
  });

</script>
</body>
</html>
